<html>
	<head>
		<title>Carnegie FS | Change Password</title>
		#{include 'html_head.html'/}
		<script type="text/javascript">
			$(document).ready(function() {
				// Dialog box settings
				$("#outcome_dialog").dialog({
					width: 400,
					height: 100,
					modal: true,
					autoOpen: false
				});	
			});
			
			var open_outcome_dialog = function(){
				$("#outcome_dialog").dialog('open');
			};
		</script>		
	</head>

	<body>
		<div id="container">
			<!-- Page Header -->
			#{include 'header.html'/}
	
			<!-- Content Area -->
			<div id="content">
				<a href="portfolio"><< Back to Portfolio</a>
				<div class="title">Change Password</div>
				#{form @CustomerArea.changeMyPasswordHandler()} 
					#{ifErrors}				
						<ul>
						#{list items:errors, as:'error' }
							<li class="error">${error}</li>
						#{/list}
						</ul>
					#{/ifErrors}   
				
					<table width="100%">
						<tr>
							<td class="profile_item_lbl">First Name</td>
							<td class="profile_item_value">${firstname}</td>
						</tr>
						<tr>
							<td class="profile_item_lbl">Last Name</td>
							<td class="profile_item_value">${lastname}</td>
						</tr>
						<tr>
							<td class="profile_item_lbl">Username</td>
							<td class="profile_item_value">${username}</td>
						</tr>
						<tr>
							<td class="profile_item_lbl">Address</td>
							<td class="profile_item_value">${address1} ${address2}</td>
						</tr>				
						<tr>
							<td class="profile_item_lbl">*Current Password</td>
							<td class="profile_item_value"><input type="password" name="currentPassword" id="currentPassword" /></td>
						</tr>
						<tr>
							<td class="profile_item_lbl">*New Password</td>
							<td class="profile_item_value"><input type="password" name="newPassword" id="newPassword" /></td>
						</tr>
						<tr>
							<td class="profile_item_lbl">*Retype New Password</td>
							<td class="profile_item_value"><input type="password" name="retypeNewPassword" id="retypeNewPassword" /></td>
						</tr>					
					</table>
					<br />* Required<br /><br />
					<button class="button_black" type="submit">Update Password</button>    
	
				#{/form}
			</div>
			
			<!-- Page Footer -->
			#{include 'footer.html'/}
			
			<div id="outcome_dialog" title="Message">
				${flash.outcome}
				#{if flash.outcome}
					<script>open_outcome_dialog()</script>
				#{/if}
			</div>			
		</div>
	</body>
</html>